<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>table模块快速使用</title>
<link rel="stylesheet" href="../../layui/css/layui.css" media="all">
</head>
<body>


	<table class="layui-hide" id="test" lay-filter="test"></table>
	
<script type="text/html" id="toolbarDemo">
  <div class="layui-btn-container">
    <button class="layui-btn layui-btn-sm" lay-event="getCheckData">获取选中行数据</button>
    <button class="layui-btn layui-btn-sm" lay-event="getCheckLength">获取选中数目</button>
    <button class="layui-btn layui-btn-sm" lay-event="isAll">验证是否全选</button>
  </div>
</script>
<script type="text/html" id="barDemo">
  <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
  <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>

	<script src="../../layui/layui.js"></script>
	<script src="../../static/admin/js/jQuery-v3.3.1.js"
		type="text/javascript" charset="utf-8"></script>
	<script>

		layui.use('table', function() {
			var table = layui.table;
			
			table.render({
				elem : '#test',
				url : '/web/ticket_list',
				cellMinWidth : 140,
				toolbar : '#toolbarDemo',
				title:"测试数据表",
				method : "POST",
				page : true,
				limit : 10,
				cols : [ [ 
					{type : 'checkbox',fixed : 'left'},
					{field : 'folderno',width : 140,title : '单据编号',align : "center"},
					{field : 'compname',width : 140,title : '部门负责人',align : "center"}, 
					{field : 'clientpost',width : 140,title : '申请部门',align : "center",style : 'background-color: #009688; color: #fff;'},
					{fixed: 'right', title:'操作', toolbar: '#barDemo', width:150}
					] ],
			});

			table.on('toolbar(test)', function(obj) {
				var checkStatus = table.checkStatus(obj.config.id);
				switch (obj.event) {
				case 'getCheckData':
					var data = checkStatus.data;
					layer.alert(JSON.stringify(data));
					break;
				case 'getCheckLength':
					var data = checkStatus.data;
					layer.msg('选中了：' + data.length + ' 个');
					break;
				case 'isAll':
					layer.msg(checkStatus.isAll ? '全选' : '未全选');
					break;
				}
			})

		table.on('tool(test)', function(obj) {
				var data = obj.data;
				console.log(obj)
				if (obj.event === 'del') {
					layer.confirm('真的删除行么', function(index) {
						obj.del();
						layer.close(index);
					});
				} else if (obj.event === 'edit') {
					layer.prompt({
						formType : 2,
						value : data.folderno
					}, function(value, index) {
						obj.update({
							email : value
						});
						layer.close(index);
					});
				}
			});

		});
		//-------------------------------------------------------
	</script>
</body>
</html>